// 此文件是由模板文件 ".dtpl/component/$rawModuleName.ts.dtpl" 生成的，你可以自行修改模板

import { MyComponent, comify } from 'base'

@comify()
export default class extends MyComponent {
  /**
   * 组件的属性列表
   */
  properties = {
    width: {
      type: String,
      value: '100vw'
    },
    height: {
      type: String,
      value: '100vh'
    },
    api: {
      type: String,
      value: ''
    },
    params: {
      type: Object,
      value: null
    },
    pageSize: {
      type: Number,
      value: 25
    },
    list: {
      type: Array,
      value: []
    }
  }

  /**
   * 组件的初始数据
   */
  data = {
    pagination: 1,
    noMore: false,
    loading: false
  }

  /**
   * 组件属性值有更新时会调用此函数，不需要在 properties 中设置 observer 函数
   */
  onPropUpdate(prop: string, newValue: any, oldValue: any) {
  }

  onReady() {
    this.loadmore()
  }

  async loadmore() {
    const { api, params, pageSize, list } = this.properties
    const { pagination, noMore, loading } = this.data
    if (!api || noMore || loading) return
    this.setDataSmart({ loading: true })
    const { data } = await this.app.fetch({
      api, silence: true, params: Object.assign({}, params, { pageSize, pagination })
    })
    this.setDataSmart({
      // @ts-ignore
      list: [...list, ...data],
      pagination: pagination + 1,
      noMore: !data || data.length < pageSize,
      loading: false
    })
  }

}

